﻿html {
  padding: 0;
  margin: 0;
}
body {
  padding: 0;
  margin: 0;
  font-family: 'Segoe UI';
}
h1 {
  padding: 0 0 0 72px;
}
.grid {
  padding: 0 50px 0 100px;
}
.grid .tile {
  margin: 0 10px 10px 0;
  float: left;
}
.grid .tile .back {
  margin-top: -4px;
  width: 100%;
  height: 100%;
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 100%);
  /* FF3.6+ */

  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0.4)), color-stop(100%, rgba(255, 255, 255, 0)));
  /* Chrome,Safari4+ */

  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 100%);
  /* Chrome10+,Safari5.1+ */

  background: -o-linear-gradient(top, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 100%);
  /* Opera 11.10+ */

  background: -ms-linear-gradient(top, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 100%);
  /* IE10+ */

  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.4) 0%, rgba(255, 255, 255, 0) 100%);
  /* W3C */

  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#66ffffff', endColorstr='#00ffffff', GradientType=0);
  /* IE6-9 */

}
.grid .tile .title {
  color: #fff;
  padding: 4px 8px;
}
